<?php

class GalactusViewControl extends GalactusView {

	function __construct($control) {
		GalactusView::__construct($control);
	}

	public function retrieveCSS( ) {
		return '
			.snapshot-area {
				overflow: auto;
			}

			.snapshot-area li:nth-child(6n + 7) {
				margin-left: 0px !important;
			}

			.snapshot-area .table-info {
				font-size: 9px;
				margin-top: 5px;
				margin-bottom: 0;
			}

			.snapshot-area .table-info th {
				text-align: center !important;
			}

			.snapshot-area .table-info td {
				text-align: center !important;
			}

			#controls-telescope .lettering {
				font-size: 8.5px;
				text-align: center;
				min-height: 10px !important;
			}		

			#camera {
				width: 100%;
			}

			#table-coordinates {
				background-color: #f5f5f5;
				-webkit-border-radius: 4px;
				-moz-border-radius: 4px;
				border-radius: 4px;
				-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
				-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
				box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
			}

			#table-coordinates th {
				text-align: center !important;
			}

			#table-coordinates td {
				text-align: center !important;
			}

			#telescope-panel {
				overflow: auto;				
			}
		';

	}

	public function retrieveJS( ) {
		return '
			function galactus_view_control_show( ) {

				var w = $("#camera").width( );
				$("#camera").height(3/4*w);
				$("#telescope-panel").height($("#camera").height( ) - 40);

				function get_params(cmd, x, y) {
					$.ajax({
						url: "'.URL.'" + cmd,
						type: "post",
						data: { params: $("#controls-telescope input:hidden").val( ) },
						success: function(result) {
							result = result.replace("d", "º");
							result = result.replace("am", "\'");
							result = result.replace("as", \'"\');
							result = result.split("/");
							x.text(result[0]);
							y.text(result[1]);
						},
						dataType: "json",
						async: false
					});
				}

				var timer_get_params = setInterval(function( ) {
					get_params("CONTROL/GET_RA_DEC", $("#ra"), $("#dec"));
					get_params("CONTROL/GET_AZ_ALT", $("#az"), $("#alt"));
					if($("#controls-telescope").length == 0) {
						clearInterval(timer_get_params);
						timer_get_params = null;		
					}
				}, 5000);

				$(".btn").click(function( ) {
					switch($(this).attr("galactus-command")) {
						case "GOTO":
							var params = null;
							switch($(".class").val( )) {
								case "AZ_ALT": break;
								case "RA_DEC": params = $(".radec").serializeArray( ); break;
							}
							$.ajax({
								url: "'.URL.'CONTROL/GOTO",
								type: "post",
								data: { params: [$("#controls-telescope input:hidden").val( ), params] }
							});
							break;
						case "SNAPSHOT":
							$.ajax({
								url: "'.URL.'CONTROL/SNAPSHOT",
								type: "post",
								data: { params: [$("#controls-telescope:hidden").val( ), $("#ra").text( ), $("#dec").text( ), $("#az").text( ), $("#alt").text( )] },
								success: function(result) { $(".snapshot-area .thumbnails").append(result); }
							});
							break;
					}
				});

				$(document).on("click", ".snapshot-area .close", function( ) {
					var li = $(this).closest("li");
					$.ajax({
						url: "'.URL.'GALLERY/REMOVE_CONTENT",
						type: "post",
						data: { params: $(this).val( ) },
						success: function(result) {
							li.remove( );
						},
						error: function(result) {
							$("#contentarea").html(result);
						}
					});
				});

			}
		';
	}

	public function show($telescope_id) {
		$schedule = end($this->control->model->isScheduled($telescope_id, $this->control->user_id));
		$telescope = end($this->control->model->retrieveTelescope($telescope_id));
		$now = new DateTime( );
		$controls_telescope = '';
		$sky_chart = 'http://www.astronews.com.br/SkyChart/SkyChart.php?year='.$now->format("Y").'&month='.$now->format("m").'&day='.$now->format("d").'&hour='.$now->format("H").'&minute='.$now->format("i").'&timezone=-3&sitelong=-35.210953&sitelat=-5.794478&img_w=610&img_h=610&name=y&line=y&mode=all&d_sign=y&t_sign=n&horizon=y';		
		if(!empty($schedule)) {
			$controls_telescope = '
				<form id="controls-telescope">
					<input type="hidden" value="'.$telescope["telescope_id"].'" />
					<div class="controls controls-row">
						<div class="lettering offset3 span3">HORAS</div>
						<div class="lettering span3">MINS</div>
						<div class="lettering span3">SEGS</div>
					</div>
					<div class="controls controls-row">
						<div class="span3">RA</div>
						<input type="number" min="0" max="24" class="radec span3" id="ra-hours" />
						<input type="number" min="0" max="59" class="radec span3" id="ra-minutes" />
						<input type="number" min="0" max="59" class="radec span3" id="ra-seconds" />
					</div>
					<div class="controls controls-row">
						<div class="lettering offset3 span3">GRAUS</div>
						<div class="lettering span3">ARCMINS</div>
						<div class="lettering span3">ARCSEGS</div>
					</div>
					<div class="controls controls-row">
						<div class="span3">DEC</div>
						<input type="number" min="-90" max="90" class="radec span3" id="dec-degrees" />
						<input type="number" min="0" max="59" class="radec span3" id="dec-arcminutes" />
						<input type="number" min="0" max="59" class="radec span3" id="dec-arcseconds" />
					</div>
					<div class="controls controls-row lettering-row">
						<div class="lettering offset3 span3">GRAUS</div>
						<div class="lettering span3">ARCMINS</div>
						<div class="lettering span3">ARCSEGS</div>
					</div>
					<div class="controls controls-row">
						<div class="span3">AZ</div>
						<input type="number" min="0" max="360" class="span3" id="az-degrees" />
						<input type="number" min="0" max="59" class="span3" id="az-arcminutes" />
						<input type="number" min="0" max="59" class="span3" id="az-arcseconds" />
					</div>
					<div class="controls controls-row">
						<div class="lettering offset3 span3">GRAUS</div>
						<div class="lettering span3">ARCMINS</div>
						<div class="lettering span3">ARCSEGS</div>
					</div>
					<div class="controls controls-row">
						<div class="span3">ALT</div>
						<input type="number" min="0" max="90" class="span3" id="alt-degrees" />
						<input type="number" min="0" max="59" class="span3" id="alt-arcminutes" />
						<input type="number" min="0" max="59" class="span3" id="alt-arcseconds" />
					</div>
					<hr />
					<div class="controls controls-row">
						<div class="span9">			
							<label class="radio inline"><input type="radio" name="coordinate-type" value="RA_DEC" checked="checked" /> RA/DEC</label>
							<label class="radio inline"><input type="radio" name="coordinate-type" value="AZ_ALT" /> AZ/ALT</label>
						</div>
						<a galactus-command="GOTO" class="btn span3"><i class="icon-map-marker"></i></a>
					</div>
				</form>
				<hr />
			';
		}
		else {
			$controls_telescope = '
				<form id="controls-telescope">
					<input type="hidden" value="'.$telescope["telescope_id"].'" />
				</form>
			';
		}
		echo '
			<div class="container-fluid">
				<div class="row-fluid">
					<div class="alert alert-info fade in span12">
						<button type="button" class="close" data-dismiss="alert">×</button>
						Você escolheu o telescópio <strong>'.$telescope["name"].'</strong>!
					</div>
				</div>
				<div class="row-fluid">
					<table class="table table-bordered table-condensed" id="table-coordinates">
						<tr><th>Ascensão Reta</th><th>Declinação</th><th>Azimute</th><th>Altitude</th></tr>
						<tr><td id="ra">00h00m00s</td><td id="dec">00º00\'00"</td><td id="az">00º00\'00"</td><td id="alt">00º00\'00"</td></tr>
					</table>
				</div>
				<div class="row-fluid">
					<div class="span5 well" id="telescope-panel">
						<img src="'.$sky_chart.'" class="img-rounded" />
						<hr />
						'.$controls_telescope.'
						<div class="row-fluid">
							<a galactus-command="SNAPSHOT" class="btn span12"><i class="icon-camera"></i></a>
						</div>		
					</div>	
					<div class="span7">
						<img class="shadowoutter" id="camera" src="http://'.$_SERVER["HTTP_HOST"].':8090/camera'.$telescope["telescope_id"].'.mjpeg" />
					</div>
				</div>
				<div class="row-fluid">
					<div class="span12 well snapshot-area">
						<ul class="thumbnails"></ul>
					</div>
			</div>
			<script type="text/javascript"> $(galactus_view_control_show( )); </script>
		';
	}

}

?>
